<template>
   <div id="app">
     我是{{name}},今年{{age}}岁!我来自：<span v-html="university"></span>
     <br>
     <p v-if="age < 18">未成年！</p>
     <p v-else-if="age == 18">恰好成年！</p>
     <p v-else>已成年!</p>
     <ul>
          <li v-for="m in majors" :key="m">{{m}}</li>
     </ul>
     <hr>
     <botton v-on:click="count++">点我</botton>
     <p>已点击{{count}}次按钮！</p>
     <button v-on:click="myMethods2">点我2</button>
     <br>
     <button @click="myMethods2">点我3</button>
     <br><br>
     <button @click="getuserbyid(2)">点我4</button>
        </div>
</template>

<script>

export default {
  name: 'App',
  data() {
    return {
      name:"完颜申",
      age:20,
      university:'<h3>大连民族大学</h3>',
      majors:['软件工程','计算机科学','网络工程','人工智能'],
      count:0,
      user:{name:'完颜申',address:'软件工程'}
    }
  },
  methods: {
    myMethods1:function(){
      this.count++;
    },
    myMethods2(){
      this.count +=2;
    },
    getuserbyid(id){
      alert('id=' + id + ', name=' + this.user.name + ', address=' + this.user.address)      
    }
      
    }
  }
</script>

<style>

</style>
